<template>
	<view>
		<u-card border-radius='0' :show-head="false" :show-foot="false" padding="0" margin="20rpx" :border="false">
			<view slot="body">
				<view style="font-size: 36rpx; margin-top: 20rpx;margin-bottom: 20rpx;" v-bind:style="{ 'display': recommendData.isShowPlateName ? 'block' : 'none'}">
					<view>{{recommendData.plateName}}</view>
				</view>
				<view class="recommend-box" v-for="(item,index) in recommendData.list" :key="index" @click="gotoDetail(item.houseId,item.type)">
					<view class="image-sign-box">
						<image class="recommendImage" :src="item.picPath" mode=""></image>
						<view class="sign-box">
							<span class="sign-span">{{item.sign}}</span>
						</view>
					</view>
					<view class="image-title-box">
						<view style="font-size: 40rpx;">
							<span style="">{{item.title}}</span>
							<span style="color: #FF0000;margin-left: 5rpx;font-size: 35rpx;">{{item.price}}</span>
						</view>	
					</view>
				</view>
			</view>
		</u-card>
	</view>
</template>

<script>
	import config from '../../../utils/config.js'
	export default {
		data() {
			return {

			}
		},
		computed: {
			recommendData() {
				// console.log(this.dataList)
				var list = []
				var houseInfo = this.dataList.houseInfo
				//获取图片的路径
				for (let i = 0; i < houseInfo.list.length; i++) {
					let picPath = ''
					// let imageAddressList = houseInfo.list[i].imageAddressList
					// picPath = config.host + imageAddressList[0].address
					let house = []
					house = houseInfo.list[i].house
					if(house.indexImage !== '' && house.indexImage !== null){
						picPath = config.host + house.indexImage
					}
					let title = house.title
					var sign = ''
					if(house.type === 0){
						sign = '出租'
					}else{
						sign = '出售'
					}
					let data = {
						"houseId": house.id,
						"picPath": picPath,
						"title": title,
						"type": house.type,
						"price": house.price,
						"sign": sign
					}
					list.push(data)
				}
				var show = {
					"plateName": this.dataList.plateName,
					"isShowPlateName": this.dataList.isShowPlateName,
					"list": list
				}
				return show
			}
		},
		methods: {
			gotoDetail(houseId, type) {
				//跳转到租房或者卖房详情页
				if (type === 0) {
					wx.navigateTo({
						// url: 'test?id=1&name=uapp'  c传递参数
						url: '/pages/components/rentDetail?houseId=' + houseId + '&recommandId=' + this.dataList.recommandId
					})
				} else {
					wx.navigateTo({
						// url: 'test?id=1&name=uapp'  c传递参数
						url: '/pages/components/buyDetail?houseId=' + houseId + '&recommandId=' + this.dataList.recommandId
					})
				}
			}
		},
		props: {
			dataList: {}
		}
	}
</script>

<style>
	.recommend-box :not :first-child{
		margin-top: 80rpx;
		margin-bottom: 10rpx;
		height: 400rpx;
	}

	.recommendImage {
		width: 100%;
		height: 400rpx;
		z-index: 1;
		position: absolute;
	}

	.re-font-box {
		z-index: 10;
		position: absolute;
		font-size: 48rpx;
		bottom: 10rpx;
		left: 10rpx;
		color: #333;
	}

	.image-sign-box {
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 400rpx;
	}
	.image-title-box{
		position: relative;
		overflow: hidden;
		width: 100%;
		display: block;
	}
	.sign-box {
		width: 291rpx;
		height: 218rpx;
		position: absolute;
		/*background: green;*/
		top: -80rpx;
		right: -100rpx;
		transform: rotate(45deg);
		z-index: 1000
	}

	.sign-span {
		position: absolute;
		bottom: 0;
		display: block;
		font-size: 50rpx;
		color: #fff;
		background: #36A8FF;
		width: 318rpx;
		text-align: center;
	}
</style>
